<template>
    <div class="app-container">
        <el-form ref="form" :model="form" label-width="120px">
            <el-form-item label="原密码">
                <el-input v-model="form.originPassword"/>
            </el-form-item>
            <el-form-item label="新密码">
                <el-input v-model="form.newPassword"/>
            </el-form-item>
            <el-form-item label="确认新密码">
                <el-input v-model="form.checkPassword"/>
            </el-form-item>
            <el-form-item>
                <el-button type="success" @click="onSubmit">确定修改</el-button>
                <el-button type="warning" @click="onCancel">重置</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    import {mapMutations} from "vuex";

    export default {
        name: 'ChangePassword',
        data() {
            return {
                form: {
                    originPassword: '',
                    newPassword: '',
                    checkPassword: ''
                }
            };
        },
        methods: {
            ...mapMutations(['saveToken']),
            onSubmit() {
                if (this.form.newPassword.trim() !== this.form.checkPassword.trim()) {
                    alert("两次输入的密码不一致！")
                    return false;
                }
                console.log(JSON.stringify(this.form))
                this.$request({
                    url: '/changePassword',
                    method: 'post',
                    data: JSON.stringify({
                        userName: 'admin',
                        originPassword: this.form.originPassword,
                        newPassword: this.form.checkPassword
                    })
                }).then(res => {
                    console.log(res)
                    if (res.code === -1) {
                        alert(res.msg);
                    }else {
                        alert(res.data);
                        this.saveToken({"token": ''});
                    }
                })
            },
            onCancel() {
                this.form.newPassword = '';
                this.form.checkPassword = '';
                this.form.originPassword = '';
            }
        }
    }
</script>

<style scoped>
    .line {
        text-align: center;
    }
</style>
